<!-- 搜索界面 -->
<template>
	<view>
		<!-- 搜索框 -->
		<u-gap height="10" bgColor="#ffffff"></u-gap>
		<u-search :showAction="true" actionText="搜索" placeholder="请输入想搜索的新闻" v-model="keyword" :animation="true"
			@custom="handleClickSearh"></u-search>
		<u-gap height="10" bgColor="#ffffff"></u-gap>
		<!-- 新闻列表 -->
		<u-list :show-scrollbar="true">
			<u-list-item v-for="(item, index) in indexList" :key="index">
				<u-cell :title="item.news_title" @click="handleClickItem(item.news_id)">
					<u-avatar slot="icon" shape="square" size="35" :src="item.news_cover"
						customStyle="margin: -3px 5px -3px 0"></u-avatar>
					{{item.release_time}}
				</u-cell>

			</u-list-item>
			<u-gap height="10" bgColor="#ffffff"></u-gap>
			<u-loadmore :status="status" :loading-text="loadingText" :loadmore-text="loadmoreText"
				:nomore-text="nomoreText" />
			<u-gap height="10" bgColor="#ffffff"></u-gap>
		</u-list>
	</view>
</template>

<script>
	import api from '@/common/api/api.js'
	export default {
		data() {
			return {
				indexList: [],
				status: 'nomore',
				loadingText: '努力加载中',
				loadmoreText: '轻轻上拉',
				nomoreText: '实在没有了',
				keyword: ""
			}
		},
		onLoad: async function(e) {
			// 通过关键字搜索
			this.keyword = e.selectMsg
			this.status = "loading"
			let newData = await api("/news/selectByTitle?news_title=" + this.keyword)
			this.indexList = newData.data
			this.status = "nomore"
			console.log(this.indexList)
		},
		methods: {
			// 点击特定的元素后跳转
			handleClickItem(e) {
				uni.navigateTo({
					url: "/pages/home/detail/detail?titleId=" + e
				})
			},
			async handleClickSearh() {
				this.status = "loading"
				let newData = await api("/news/selectByTitle?news_title=" + this.keyword)
				this.indexList = newData.data
				this.status = "nomore"
				console.log(this.indexList)
			}
		}
	}
</script>

<style>

</style>